<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p>localStorage--本地存储，将数据存入硬盘，关闭页面、关闭浏览器、关闭电脑都不受影响。本地持久化存储</p>
    <button onclick="add()">新增</button>
    <button onclick="getData()">查询</button>
    <button onclick="delData()">删除</button>
    <button onclick="delAll()">清空</button>
    <script>
        var time = '2022-11-16 pm' // 临时性数据 存在内存中
        var val1 = {
            name: 'hello',
            age: 18
        }
        function add() {
            // 设置数据项 设置之前没有的就是新增  已有的就是修改
            localStorage.setItem('nowTime', JSON.stringify(val1))  // 降维 从高级数据变成低级数据
        }
        function getData() {
            var data = localStorage.getItem('nowTime');
            console.log(JSON.parse(data)); // 支棱起来 恢复原来的样子
        }
        function delData() {
            // 删除指定项
            localStorage.removeItem('nowTime')
        }
        function delAll() {
            localStorage.clear()
        }
        // 事件 stora事件 同源的网页中 存储的数据变化时 会触发这个事件
        window.addEventListener('storage', function(e) {
            console.log(e);
        })
    </script>
</body>
</html>